﻿@{
    Style.Require("jQueryUI_Orchard");
    Style.Require("PmpNetwork.Wiki");
    Style.Require("PmpNetwork.Wiki.Quiz");
    
    Script.Require("jQuery").AtHead();
    Script.Require("jQueryUI");
}
<div class="traditional-container">  
    <div id="wiki-tabs">
        <ul>
            <li><a href="#wiki-content">@T("Wiki")</a></li>
            <li><a href="@Url.Action("Questions", "Wiki", new { name = Model.Name})">@T("Quiz")</a></li>
        </ul>
        <div id="wiki-content">
            @if (Model.WikiContent != null) {
                <div class="commands">
                    <a href="@Url.Action("Edit", "WikiAdmin", new { name = Model.Name})" class="button primaryAction">@T("Edit")</a>
                </div>
                @Display(Model.WikiContent)
            } else {
                <div class="commands">
                    <a href="@Url.Action("Create", "WikiAdmin", new { name = Model.Name})" class="button primaryAction">@T("Create")</a>
                </div>
                <h2>@T("This article is not exists.")</h2>
            }
        </div>
        <div class="tab-load-failed" style="display: none;">@T("This content is currently unavailable. Please come back again later.")</div>
    </div>    
</div>
<script type="text/javascript">
    (function ($, undefined) {
        $(document).ready(function () {
            $("#wiki-tabs").tabs({
                beforeLoad: function (event, ui) {
                    ui.jqXHR.error(function () {
                        ui.panel.html($(".tab-load-failed").html());
                    });
                },
                load: function (event, ui) {
                    $("#buttonResult").click(function () {
                        $(this).hide();
                        var numberOfCorrects = 0;
                        var questions = $(".wiki-questions .question").each(function () {
                            var question = $(this);

                            var isCorrect = true;
                            
                            var options = question.find(".option").each(function () {
                                var option = $(this);
                                var isCorrectOption = option.find(".option-text").attr("correct") == "1";
                                if (isCorrectOption) {
                                    option.addClass("correct");
                                }
                                var checkbox = option.find("input[type=checkbox]").attr("disabled", "disabled");

                                if (isCorrect) {
                                    isCorrect = isCorrectOption == checkbox.is(":checked");
                                }                                
                            });

                            if (isCorrect) numberOfCorrects++;
                            question.find(".question-reason").not(".empty").show();
                        });
                        alert('@T("Your result: {0} correct(s) / {1} question(s). ")'.replace("{0}", "" + numberOfCorrects).replace("{1}", "" + questions.length));
                    });
                }
            });
        });
    })(jQuery);

</script>